<template>
    <view class="moneys cl">
        <view @click="rechargeClick(item,i)" v-for="(item,i) in monenys" :key="i" class="money fl" :class="{active:i==active}">
            <template v-if="item.type==1">
                <text class="num">{{item.money}}</text>
                <view class="msg">{{item.msg}}</view>
            </template>
            <template v-if="item.type==2">
                <input class="input" v-model="item.money" maxlength="9" @input="inputCahnge($event,item,i)" type="number" :placeholder="placeholder" @focus="placeholder=''"
                    @blur="placeholder = '自定义'">
            </template>
        </view>
    </view>
</template>

<script>
    export default {
        props: {
            monenys: {
                type: Array,
                default: () => []
            },
            active: {
                type: Number,
                default: () => 0
            }
        },
        data() {
            return {
                placeholder: '自定义'
            }
        },
        methods: {
            rechargeClick(item, i) {
                item.index = i
                this.$emit('rechargeClick', item)
            },
            inputCahnge(e, item, i) {
                item.money = item.money && +(item.money.replace(/[^\d]/g, ''))
                this.rechargeClick(item, i)
            }
        }
    }
</script>

<style lang="less" scoped>
    @import 'index';
</style>
